<html>

	<head>
		<meta charset="utf-8" />
		<title>BOSS后台系统</title>
		<link rel="stylesheet" type="text/css" href="../static/css/Boss_index.css" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 maximum-scale=1.0, user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../static/table/css/demo.css">
		<link rel="stylesheet" type="text/css" href="../static/table/css/style.css" />
		<link rel="stylesheet" type="text/css" href="../static/table/css/basictable.css" />
		<link rel="stylesheet" type="text/css" href="../static/css/tcc.css" />
		<style type="text/css">
			.hr_{
				margin-top: -10px;
				width: 100%;
				height: 10px;
				border: 1px solid ghostwhite;
				background-color: gainsboro;
			}
			
			.title_a{
				margin-top: 20px;
				margin-left: 100px;
			}
			.title_a span{
				margin-left: 50px;
			}
			.title_b{
				margin-top: 30px;
				margin-left: 120px;
			}
			.title_b ul li{
				display: inline-block;
				margin-left: 30px;
			}
			#img_a{
				width: 200px;
				height: 100px;
				border: 1px solid;
				margin: 20px;
			}
			
			.pop-content-left{
				line-height: 40px;
				margin-left: 40px;
				margin-top: 20px;
			}
			.img_div{
				display: none;
				width: 200px;
				height: 200px;
				position: absolute;
				left: 200px;
				top: 150px;
				z-index: 3;
			}
			.ul_li{
				width: 300px;
				height: 400px;
				border: 1px solid;
			}
		</style>
	</head>

	<body>
		<header class="am-topbar admin-header">
			<div class="am-topbar-brand">
				<strong>BOSS</strong> <small>系统后台管理</small>
			</div>
		</header>
		<div class="am-cf am-padding">
			<div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">BOSS</strong> / <small>审核</small></div>
		</div>
		
		
		<!--表格-->
		<div class="container">
			<div id="page">

				<table class="table table-bordered" id="mytable">
					<thead>
						<tr>
							<th>ID</th>
							<th>姓名</th>
							<th>证件类型</th>
							<th>审核状态 </th>
							<th>提交审核时间</th>
							<th>审核结束时间</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td>Jill Smith</td>
							<td>25</td>
							<td>Female</td>
							<td>5'4</td>
							<td>British Columbia</td>
							<td>Volleyball</td>
							<td>
									<a href="#" class="click_pop">审核</a>
							</td>
						</tr>

					</tbody>
				</table>

			</div>
		</div>

		<div class="a2">
			<div style="width: inherit;height: 20px;">
				<div class="button1">X</div>
			</div>
			<form>
				<h1 class="title">审核失败原因</h1>
				<div class="content">
					<textarea rows="3" cols="20">
										</textarea>
				</div>

				<p>
					<input class="sure1" type="submit" value="确定 " />
					<input class="sure2" type="button" value="取消 " />
				</p>
			</form>

		</div>

		<!--遮罩层-->
		<div class="bgPop"></div>
		<!--弹出框-->
		<div class="pop">
			<div class="pop-top">
				<h2>BOSS审核</h2>
				<span class="pop-close">Ｘ</span>
			</div>
			<div class="pop-content">
				<div class="pop-content-left">
					<ul>
						<li>姓名:<span>张三</span></li>
						<li>身份证:<span>试试</span></li>
						<li>公司全名:<span>鼎众科技有限公司</span></li>
						<li>证件类型:<span></span></li>
						<li>证件照片:<span id="img_a"><img src="../static/table/img/gg.jpg" height="40px" class="img_b"></span></li>
						<li>审核状态:<span>待审核</span></li>
						<li>提交审核时间:<span>2019-2-2</span></li>
						<li>结束审核时间:<span>2019-2-3</span></li>
					</ul>
				</div>
				<div class="img_div">
					<img src="../static/images/fast-reg.png" height="200px" width="200px"/>
				</div>
			</div>
			<div class="pop-foot">
				<input type="button" value="通过" class="pop-cancel pop-close " />
				<input type="button" value="失败" class="pop-ok To_examine" />
			</div>
		</div>
		<script>
		</script>

	</body>

	<script src="../static/table/js/jquery-2.1.1.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="../static/table/js/jquery.basictable.min.js"></script>
	<script src="../static/table/js/sz.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			$(".sure1").click(function(){
				$(".bgPop").hide();
				$(".pop").hide();
			})

			$(".To_examine").click(function() {
				$(".a2").show();

			});
			$(".sure1").click(function() {
				$(".a2").hide();
			});
			$(".sure2").click(function() {
				$(".a2").hide();
			});
			$(".button1").click(function() {
				$(".a2").hide();
			});
			$('#table').basictable();

			$('#table-breakpoint').basictable({
				breakpoint: 768
			});

			$('#table-swap-axis').basictable({
				swapAxis: true
			});

			$('#table-force-off').basictable({
				forceResponsive: true
			});

			$('#table-no-resize').basictable({
				noResize: true
			});

			$('#table-two-axis').basictable();

			$('#table-max-height').basictable({
				tableWrapper: true
			});

			$('.pop-close').click(function() {
				$('.bgPop,.pop').hide();
			});
			$('.click_pop').click(function() {
				$('.bgPop,.pop').show();
			});
			
			$(".img_b").click(function(){
				$(".img_div").show()
			})
			
			$(".img_div").click(function(){
				$(".img_div").hide()
			})
		});
	</script>

</html>